<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>智能工作日报系统</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Google+Sans:wght@400;500;700&display=swap">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
    <div class="container">
        <header>
            <h1>智能工作日报系统</h1>
            <div class="header-stats" id="headerStats">
                <span id="totalRecords">暂无数据</span>
            </div>
        </header>

        <!-- 主要内容区域 - 日报汇总 -->
        <main class="main-content">
            <div class="card">
                <div class="card-header">
                    <h2><span class="material-icons" style="vertical-align: middle; margin-right: 8px;">insights</span>日报汇总</h2>
                    <div class="header-actions">
                        <button class="action-btn refresh-btn" onclick="refreshData()" title="刷新数据">
                            <span class="material-icons">refresh</span>刷新
                        </button>
                    </div>
                </div>
                
                <div class="filter-area">
                    <div class="filter-group">
                        <label>开始日期
                            <input type="date" id="startDate">
                        </label>
                        <label>结束日期
                            <input type="date" id="endDate">
                        </label>
                        <label>项目组
                            <select id="projectGroupFilter">
                                <option value="">全部项目组</option>
                            </select>
                        </label>
                    </div>
                    <div class="filter-actions">
                        <button onclick="filterData()" class="btn btn-primary">
                            <span class="material-icons">filter_alt</span>筛选
                        </button>
                        <button onclick="clearFilters()" class="btn btn-secondary">
                            <span class="material-icons">clear</span>清空
                        </button>
                    </div>
                </div>
                
                <div id="summaryResult" class="result-area">
                    <div class="empty-state">
                        <div class="empty-icon">
                            <span class="material-icons" style="font-size: 64px;">description</span>
                        </div>
                        <h3>暂无数据</h3>
                        <p>请先上传Excel文件来查看日报汇总</p>
                        <button onclick="openUploadModal()" class="btn btn-primary">
                            <span class="material-icons">upload_file</span>上传文件
                        </button>
                    </div>
                </div>
            </div>
        </main>

        <!-- 浮动操作按钮 -->
        <div class="floating-actions">
            <button class="fab fab-upload" onclick="openUploadModal()" title="上传Excel文件">
                <span class="material-icons">upload_file</span>
            </button>
            <button class="fab fab-ai" onclick="openAIModal()" title="AI智能解读">
                <span class="material-icons">psychology</span>
            </button>
        </div>

        <!-- 文件上传模态框 -->
        <div id="uploadModal" class="modal">
            <div class="modal-content">
                <div class="modal-header">
                    <h3><span class="material-icons" style="vertical-align: middle; margin-right: 8px;">upload_file</span>上传Excel文件</h3>
                    <button class="modal-close" onclick="closeUploadModal()">
                        <span class="material-icons">close</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="upload-area" id="uploadArea">
                        <div class="upload-content">
                            <span class="material-icons upload-icon">cloud_upload</span>
                            <p>点击选择文件或拖拽文件到此处</p>
                            <p class="upload-hint">支持 .xlsx, .xls 格式，最大500MB</p>
                            <input type="file" id="fileInput" accept=".xlsx,.xls" style="display: none;">
                        </div>
                    </div>
                    <div id="uploadResult" class="result-area" style="display: none;"></div>
                </div>
            </div>
        </div>

        <!-- AI解读模态框 -->
        <div id="aiModal" class="modal">
            <div class="modal-content modal-large">
                <div class="modal-header">
                    <h3><span class="material-icons" style="vertical-align: middle; margin-right: 8px;">psychology</span>AI智能解读</h3>
                    <button class="modal-close" onclick="closeAIModal()">
                        <span class="material-icons">close</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="ai-input-area">
                        <textarea id="aiQuestion" placeholder="请输入您的问题，例如：&#10;• 本周各项目组的工作进展如何？&#10;• 哪些员工的工作效率最高？&#10;• 最近有哪些重要的项目进展？"></textarea>
                        <div class="ai-actions">
                            <button onclick="askAI()" class="btn btn-primary">
                                <span class="material-icons">send</span>开始分析
                            </button>
                            <button onclick="clearAIQuestion()" class="btn btn-secondary">
                                <span class="material-icons">delete</span>清空
                            </button>
                        </div>
                    </div>
                    <div id="aiResult" class="result-area"></div>
                </div>
            </div>
        </div>

        <!-- 遮罩层 -->
        <div id="modalOverlay" class="modal-overlay"></div>
    </div>

    <script src="{{ url_for('static', filename='script.js') }}"></script>
</body>
</html>